<template>
<!--  <el-row class="tac">-->
<!--  <el-col :span="3">-->
    <el-menu
        style = "min-height: 100vh; width: 200px"
        active-text-color="#6495EDFF"
        background-color="#545c64"
        class="el-menu-vertical-demo"
        default-active="2"
        text-color="#fff"
        @open="handleOpen"
        @close="handleClose"
        router
    >
      <el-sub-menu index="1" v-if="user.role === 1 || user.role === 2 || user.role === 4">
        <template #title>
          <i class="el-icon-user"></i>
          <span>人员管理</span>
        </template>
<!--        <el-menu-item index="person">个人信息管理</el-menu-item>-->
        <el-menu-item index="student" v-if="user.role === 1 || user.role === 4 || user.role === 2">学员档案管理</el-menu-item>
        <el-menu-item index="user" v-if="user.role === 1 || user.role === 2">员工管理</el-menu-item>
        <!--              <el-menu-item index="1-3">item three</el-menu-item>-->
      </el-sub-menu>
      <el-sub-menu index="2" v-if="user.role === 1 || user.role === 4">
        <template #title>
          <i class="el-icon-s-check"></i>
          <span>教务管理</span>
        </template>
        <el-menu-item index="classes" v-if="user.role === 1">班级管理</el-menu-item>
        <el-menu-item index="course" v-if="user.role === 1">课程卡管理</el-menu-item>
<!--        <el-menu-item index="2-3">课程表管理</el-menu-item>-->
        <el-menu-item index="leave" v-if="user.role === 1 || user.role === 4">考勤管理</el-menu-item>
<!--        v-if="user.role === 4"-->
        <!--              <el-menu-item index="1-3">item three</el-menu-item>-->
      </el-sub-menu>
      <el-sub-menu index="3">
        <template #title>
          <i class="el-icon-message"></i>
          <span>信息管理</span>
        </template>
        <el-menu-item index="homework" v-if="user.role === 1 || user.role === 3">作业发布</el-menu-item>
        <el-menu-item index="activity" v-if="user.role === 1 || user.role === 4">活动信息</el-menu-item>
        <el-menu-item index="notice"  v-if="user.role === 1 || user.role === 4">通知发布</el-menu-item>
      </el-sub-menu>
      <el-sub-menu index="4">
        <template #title>
          <i class="el-icon-money"></i>
          <span>小程序管理</span>
        </template>
        <el-menu-item index="rotation"  v-if="user.role === 1 || user.role === 2">轮播图管理</el-menu-item>
        <el-menu-item index="danceKinds" v-if="user.role === 1 || user.role === 2">舞种介绍管理</el-menu-item>
        <el-menu-item index="schedule" v-if="user.role === 1 || user.role === 2">团课管理</el-menu-item>
      </el-sub-menu>
<!--      <el-sub-menu index="5">-->
<!--        <template #title>-->
<!--          <i class="el-icon-school"></i>-->
<!--          <span>机构计划管理</span>-->
<!--        </template>-->
<!--        <el-menu-item index="5-1">培训计划管理</el-menu-item>-->
<!--        <el-menu-item index="5-2">报名信息管理</el-menu-item>-->
<!--      </el-sub-menu>-->
    </el-menu>
<!--  </el-col>-->
<!--  </el-row>-->
</template>

<script>
import {defineComponent} from 'vue'


export default {
  name: "Aside",

  created() {
    let user1 = sessionStorage.getItem("user") || '{}'
    this.user = JSON.parse(user1)
    console.log("user" + this.user.username)
    console.log("role" + this.user.role)

    // this.name=JSON.parse(name).username//转成字符串//转成字符串

  },

  data(){
    return{
      user: {},

    }
  },

  methods:{
    load(){

    },
  },
}
defineComponent({
  setup() {
    const handleOpen = (key, keyPath) => {
      console.log(key, keyPath)
    }
    const handleClose = (key, keyPath) => {
      console.log(key, keyPath)
    }
    return {
      handleOpen,
      handleClose,
    }
  },
})
</script>

<style scoped>

</style>